<template>
    <el-tabs style="width:100%;" type="card" @tab-click="handleClick">
        <el-tab-pane label="Hdfs" name="hdfs">
            <TabHdfs type="hdfs"></TabHdfs>
        </el-tab-pane>
        <el-tab-pane label="Yarn" name="yarn">
            <TabHdfs type="yarn"></TabHdfs>
        </el-tab-pane>
        <el-tab-pane label="Hive" name="hive">
            <TabHdfs type="hive"></TabHdfs>
        </el-tab-pane>
        <el-tab-pane label="Hbase" name="hbase">
            <TabHdfs type="hbase"></TabHdfs>
        </el-tab-pane>
        <el-tab-pane label="Kafka" name="kafka">
            <TabHdfs type="kafka"></TabHdfs>
        </el-tab-pane>
    </el-tabs>
</template>
<script>
    import TabHdfs from './TabHdfs.vue'
    export default {
        components: {TabHdfs},
        methods: {
            handleRemove(tab) {

            },
            handleClick(tab) {
                console.log(tab);
            }
        }
    };
</script>